<template>
<el-container>
    <el-header style="height: 120px;">
        <div style="float: left; margin-top: -40px;">审核词库</div>
        <div style="padding-top: 45px">
            <el-form :inline="true" :model="filters" ref="filters" :size="size">
                <el-row class="search-input">
                    <!--<el-form-item prop="normalText" label="标准敏感词：">
                        <el-input v-model="filters.normalText" clearable placeholder="标准敏感词"></el-input>
                    </el-form-item>-->
                    <el-form-item prop="customizeText" label="自定义敏感词：">
                        <el-input v-model="filters.customizeText" clearable placeholder="自定义敏感词"></el-input>
                    </el-form-item>
                    <el-form-item>
                        <kt-button icon="fa fa-search" :label="$t('action.search')" type="primary" @click="findPage(null)" />
                    </el-form-item>
                    <el-form-item>
                        <kt-button icon="fa fa-refresh" :label="$t('action.reset')" type="primary" @click="resetForm('filters')" />
                    </el-form-item>
                </el-row>
            </el-form>
        </div>
    </el-header>
    <el-row>
        <el-col :span="24">
            <div class="grid-content bg-purple"></div>查询结果
        </el-col>
    </el-row>
    <el-form :model="dataForm" ref="dataForm" :size="size">
        <el-table :data="dataForm.tableData" :cell-style="setCellStyle" :size="size" style="width: 100%" :border="true">
            <el-table-column prop="type" label="敏感词分类">
                <template slot-scope="scope">
                    <div v-if="scope.row.sensitiveType == 1">政治类</div>
                    <div v-if="scope.row.sensitiveType == 2">侮辱性词汇</div>
                    <div v-if="scope.row.sensitiveType == 3">其他</div>
                </template>
            </el-table-column>
            <el-table-column prop="dataForm.tableData.normalText" label="标准敏感词">
                <template slot-scope="scope">
                    <el-row>
                        <el-col :span="21">
                            <el-input type="textarea" v-model="scope.row.normalText" style="width:90%" class="setTextareaHight"></el-input>
                        </el-col>
                        <el-col :span="3">
                            <kt-button label="保存" type="primary" @click="handleAdd(scope.row.id,scope.row.normalText,scope.row.customizeText)" />
                        </el-col>
                    </el-row>
                </template>
            </el-table-column>
            <el-table-column prop="dataForm.tableData.customizeText" label="自定义敏感词">
                <template slot-scope="scope">
                    <el-row>
                        <el-col :span="21">
                            <el-input type="textarea" v-model="scope.row.customizeText" style="width:90%" class="setTextareaHight"></el-input>
                        </el-col>
                        <el-col :span="3">
                            <kt-button label="保存" type="primary" @click="handleAdd(scope.row.id,scope.row.normalText,scope.row.customizeText)" />
                        </el-col>
                    </el-row>
                </template>
            </el-table-column>
        </el-table>
    </el-form>
</el-container>
</template>

<script>
import PopupTreeInput from "@/components/PopupTreeInput";
import CyTable from "@/views/Core/CyTable";
import KtButton from "@/views/Core/KtButton";
import TableColumnFilterDialog from "@/views/Core/TableColumnFilterDialog";
import {
    format
} from "@/utils/datetime";
import utils from "@/assets/js/utils.js";
export default {
    components: {
        PopupTreeInput,
        CyTable,
        KtButton,
        TableColumnFilterDialog
    },
    data() {
        return {
            size: "small",

            filters: {
                sensitivity: "",
                customizeText: ""
            },
            pageRequest: {
                pageNum: 1,
                pageSize: 10
            },

            dataForm: {
                tableData: [{
                    normalText: "",
                    customizeText: ""
                }]
            }
        };
    },

    methods: {
        // 获取分页数据
        findPage: function (data) {
            let this_ = this;
            if (this_.filters == undefined || this_.filters == null) {
                this_.filters = {};
            }
            this_.filters.start = this.pageRequest.pageNum;
            this_.filters.limit = this.pageRequest.pageSize;
            this.utils.request.querySensitiveList(this_.filters, function (res) {
                if (res.data == null) {
                    res.data = [];
                    res.totle = 0;
                } else {
                    this_.dataForm.tableData = res.data.rows;
                }
                //this_.$refs.JicTable.findPage({content:res.data,total:res.totle});
                // this_.pageResult = res.data;
                // this_.totalSize = Number(res.totle);
            });
        },
        //重置
        resetForm(formName) {
            this.$refs[formName].resetFields();
            this.findPage(null)
        },
        setCellStyle: function (row, column, rowIndex, columnIndex) {
            return "padding:0;height:200px;";
        },
        handleAdd: function (data, normalText, customizeText) {
            if (data != null && data != "undefined") {
                let this_ = this;
                let params = {};
                params.id = data;
                params.normalText = normalText;
                params.customizeText = customizeText;
                this.utils.request.saveSensitiveInfo(params, function (res) {
                    if (res.code == "0000") {
                        this_.$message({
                            message: "操作成功",
                            type: "success"
                        });
                        this_.findPage(null);
                    } else {
                        this_.$message({
                            message: "操作失败, " + res.msg,
                            type: "error"
                        });
                    }
                });
            }
        }
    },
    mounted() {
        this.findPage();
    }
};
</script>

<style lang="scss" scoped>
.bg-purple {
    background: #d3dce6;
}

.el-header {
    background-color: #f6f8f8;
    color: #333;
    text-align: center;
    line-height: 120px;
}

.el-main {
    background-color: #ffffff;
    color: #333;
    text-align: center;
    line-height: 500px;
}

body>.el-container {
    margin-bottom: 40px;
}

.el-container:nth-child(5) .el-aside,
.el-container:nth-child(6) .el-aside {
    line-height: 260px;
}

.el-container:nth-child(7) .el-aside {
    line-height: 320px;
}

/deep/ .setTextareaHight .el-textarea__inner {
    height: 180px;
}

/deep/ .el-form-item__label {
    padding-bottom: 85px;
}
</style>
